<#include "/layout/header.ftl" />
<#import "/include/ui.ftl" as blue />

<script src="${rc_path}/js/jquery/jquery-plupload.js"></script>
<link rel="stylesheet" href="${rc_path}/js/editor/css/editormd.css"/>
<script src="${rc_path}/js/editor/editormd.js"></script>
<script>

var editor = null;
$(function()
{
	editor = editormd("div_content",
	{
		width: "90%",
		height: 500,
		syncScrolling: "single",
		path: "${rc_path}/js/editor/lib/",
		imageUpload : true,
		imageFormats : ["jpg", "jpeg", "gif", "png"],
		imageUploadURL : "${path}/cms/doc/doc_file_upload_editor?webId=${(parentModel.webId)!}&pos=2",
		toolbarIcons : function()
		{
			return ["undo", "redo", "|", 
	            "bold", "del", "italic", "quote", "ucwords", "uppercase", "lowercase", "|", 
	            "h1", "h2", "h3", "h4", "h5", "h6", "|", 
	            "list-ul", "list-ol", "hr", "|",
	            "link", "reference-link", "image", "code", "preformatted-text", "code-block", "table", "datetime", "html-entities", "pagebreak", "|",
	            "goto-line", "watch", "preview", "fullscreen", "clear", "search"];
		}
	});
	
	$.upload(
	{
		button: "#btn_upload",
		type: 1,
		progress: "#prog_upload",
		url: "/cms/doc/doc_file_upload",
		param: {webId: "${(parentModel.webId)!}", pos: "1"},
		result: function(up, file, o)
		{
			var data = o;
			$("#hdn_upload").val(data.key);
			$("#img_upload").attr("src", data.url).show();
		}
	});
	
});

function save_click()
{
	$.simpleValid("#div_form", function(obj)
	{
		$.simpleAjax("/cms/doc/doc_save", obj, function(o)
		{
			$.successAlert("保存成功", "save_success()", 2000);
		});
	});
}
function save_success()
{
	window.location = "${path}/cms/doc/doc_list?channelId=${(parentModel.id)!}";
}
</script>

<div class="am-form am-form-horizontal am-cf am-margin" id="div_form">
<input type="hidden" name="id" value="${model.id!}"/>
<input type="hidden" name="employeeId" value="${model.employeeId!}"/>
<input type="hidden" name="channelId" value="${(parentModel.id)!}"/>
<input type="hidden" name="webId" value="${(parentModel.webId)!}"/>

	<fieldset>
		<legend><#if model.id??>修改<#else>添加</#if>文档<#if parentModel??>－栏目：${(parentModel.name)!}</#if></legend>
		
		<div class="am-u-md-8">
			<div class="am-form-group">
				<label class="am-u-md-1 am-form-label am-padding-left-0 am-padding-right-0">标题</label>
				<div class="am-u-md-10 am-u-end">
					<input type="text" name="title" placeholder="输入文档标题" class="am-form-field am-radius"  maxlength="100" value="${model.title!}" required/>
				</div>
			</div>
		</div>

		<div class="am-u-md-4">
			<div class="am-form-group">
				<label class="am-u-md-3 am-form-label am-padding-left-0 am-padding-right-0">作者</label>
				<div class="am-u-md-8 am-u-end">
					<input type="text" name="author" placeholder="输入文档作者" class="am-form-field am-radius"  maxlength="20" value="${model.author!}" required/>
				</div>
			</div>
		</div>
		
		<div class="am-u-md-8">
			<div class="am-form-group">
				<label class="am-u-md-1 am-form-label am-padding-left-0 am-padding-right-0">简介</label>
				<div class="am-u-md-10 am-u-end">
					<textarea name="summary" placeholder="输入文档简介" class="am-form-field am-radius" style="height: 100px;"
						maxlength="500">${model.summary!}</textarea>
				</div>
			</div>
		</div>

		<div class="am-u-md-4">
			<div class="am-form-group">
				<label class="am-u-md-3 am-form-label am-padding-left-0 am-padding-right-0">
					<input type="button" id="btn_upload" class="am-btn am-btn-primary am-radius" value="上传图片" />
					<input type="hidden" id="hdn_upload" name="pic" value="${model.pic!}" />
				</label>
				<div class="am-u-md-8 am-u-end" style="height: 100px;">
					<div class="am-progress" id="prog_upload" style="display: none;">
						<div class="am-progress-bar am-radius" style="width: 0%">0%</div>
					</div>
					<img src="${model.picUrl!}" id="img_upload" height="100" <#if !(model.picUrl??)>style="display: none;"</#if> />
				</div>
			</div>
		</div>

		<div class="am-u-md-4">
			<div class="am-form-group">
				<label class="am-u-md-3 am-form-label am-padding-left-0 am-padding-right-0">标题颜色</label>
				<div class="am-u-md-8 am-u-end">
					<select class="am-form-field am-radius" name="color" data-am-selected="{'btnWidth': '150px'}">
						<#assign colorMap = {"black": "黑色", "silver": "银色", "gray": "灰色", "maroon": "褐红色", "red": "红色", "purple": "紫色", "fuchsia": "桃红色", "green": "绿色", "lime": "青色", "olive": "橄榄色", "yellow": "黄色", "navy": "深蓝色", "blue": "蓝色", "teal": "蓝绿色", "aqua": "浅绿色"} />
						<@blue.select list=colorMap value=(model.color)! />
					</select>
				</div>
			</div>
		</div>

		<div class="am-u-md-4">
			<div class="am-form-group">
				<label class="am-u-md-3 am-form-label am-padding-left-0 am-padding-right-0">状态</label>
				<div class="am-u-md-8 am-u-end">
					<select class="am-form-field am-radius" name="state" data-am-selected="{'btnWidth': '120px'}" required>
						<@blue.select list=map.state value=(model.state.index)!"0" />
					</select>
				</div>
			</div>
		</div>
		
		<div class="am-u-md-4">
			<div class="am-form-group">
				<label class="am-u-md-3 am-form-label am-padding-left-0 am-padding-right-0">排序</label>
				<div class="am-u-md-8 am-u-end">
					<input type="number" name="sort" placeholder="输入文档排序" class="am-form-field am-radius"  maxlength="10" value="${model.sort!"0"}" required/>
				</div>
			</div>
		</div>
		
		<div class="am-u-md-12">
			<div id="div_content" style="margin: 0 auto;">
				<textarea name="content" style="display:none;">${model.content!}</textarea>
			</div>
		</div>

		<div class="am-u-md-12 am-text-center div_btn">
			<a href="javascript:void(0)" onclick="save_click()" class="am-btn am-btn-primary am-radius">保存</a>
			<a href="javascript:void(0)" onclick="save_success()" class="am-btn am-btn-default am-radius am-margin-left">返回</a>
		</div>
	</fieldset>
</div>

<#include "/layout/footer.ftl" />